ul,li{margin: 0; padding: 0;}
header{
	background: linear-gradient(to bottom,white,#CAFFFF); height: 60px;
	position: relative;
}
nav{
	background:url(../img/logo_170x46.png) no-repeat 150px; height: 60px ;
}
li{list-style: none;}
.title{ padding-top: 25px; width: 580px; margin-left: 350px;}
.title:after{
	content: '';display: block;clear: both;
}
.title li{
	float: left; padding: 0px 8px; 
	font-size: 18px;
}
a{color: black; text-decoration: none;}
#zhuan{
	display: block;
	width: 69px; height: 23px;
	background: url(../img/header_03.png) no-repeat;
	position: absolute; top: 3px; left: 360px;
}
#lun{position: absolute; top: 25px; right: 300px;}
#wei{position: absolute; top: 25px; right: 260px;}
#you{position: absolute; top: 25px; right: 220px;}
.title li a:hover{color: red;}
@keyframes spread{
	0%{width: 0px;}
	10%{width: 10px;}
	20%{width: 20px;}
	30%{width: 25px;}
	40%{width: 30px;}
	50%{width: 35px;}
	60%{width: 42px;}
	70%{width: 47px;}
	80%{width: 52px;}
	90%{width: 58px;}
	100%{width: 69px;}
}
.title li:first-of-type:hover #zhuan{
	background: url(../img/header_05.png) no-repeat;
	animation: spread 0.5s linear both;
}
#hua{
	display: block;
	width: 69px;
	height: 23px;
	background: url(../img/header_07.png) no-repeat;
	position: absolute; top: 3px; left: 555px;
}
.title li:nth-of-type(3):hover #hua{
	background: url(../img/header_09.png) no-repeat;
	animation: spread 0.5s linear both;
}
#lun:hover{
	transform: rotate(360deg);
	transition: all 0.5s linear;
}
